import React from "react";
import Button from 'antd/lib/button';
import Divider from 'antd/lib/divider';
import Menu from 'antd/lib/menu';
import Modal from 'antd/lib/modal';
import PaymentTable from "@/components/payment/PaymentTable";
import PaymentAttache from "@/components/payment/PaymentAttache";
import PaymentActivityList from "@/components/payment/PaymentActivityList";
import notification from "@/services/notification";
import { currentUser } from "@/services/auth";
import Customer from "@/services/customer";
import WarningOutlined from "@ant-design/icons/WarningOutlined";
import Project from "@/services/project";
import OrgUnit from "@/services/orgunit";

import Lookcheck from "@/components/workflow/Lookcheck";
import { createBrowserHistory } from 'history';
import { inject, observer } from 'mobx-react';

const customHistory = createBrowserHistory();
const { confirm } = Modal;

class PaymentToolbar extends React.Component {
  state = {
    loading: true,
    openpage: "jbxx",
    paymentuserdata: [],
    projectdata: [],
    orgunitdata: [],
    customerdata: [],
  };
  componentWillMount() {
    Customer.querycustomeruser({ code: "", name: "", userid: currentUser.id, }).then(data => {
      this.setState({
        paymentuserdata: data,
        loading:false,
      });
    });

    Project.getsellist({ bytstatus: '已签', billid: this.props.id, }).then(data => {
      this.setState({
        loading: false,
        projectdata: data,
      });
    });
    Customer.getcustomerlist({ page: 1, pagesize: 10000, strcustomercode: '', strcustomername: '', }).then(data => {
      this.setState({
        customerdata: data.data,
      });
    });
    OrgUnit.queryActive().then(data => {
      this.setState({
        orgunitdata: data,
      });
    });
    this.refreshData(this.props.id, this.props.projectdetailid,this.props.paytype);
  }
  refreshData(id, projectdetailid,paytype) {
    this.props.paymentStore.initStore(id,projectdetailid,paytype);
  }
  handleadd = () => {
    this.refreshData(0,0,this.props.paytype);
  };

  handleSave = () => {
    this.props.paymentStore.dataSave();
  };
  handleDelete = () => {
    if (this.props.paymentStore.paymentModel.userid !== currentUser.id) {
      notification.error("不是创建人，不能删除！");
      return;
    }
    confirm({
      title: '确定删除?',
      icon: <WarningOutlined />,
      content: this.props.paymentStore.paymentModel.name,
      okText: '确定',
      okType: 'danger',
      cancelText: '取消',
      onOk: () => {
        this.props.paymentStore.dataDelete();
      },
    });
  };

  handlebackpage = () => {
    customHistory.goBack();
  };
  handleCheck = () => {
    if (!currentUser.isAudit) {
      notification.error("没有权限.");
      return;
    }
    this.props.paymentStore.billCheck(currentUser.id);
  };
  tabsClick = e => {
    this.setState({
      openpage: e.key,
    });
  };
  templateSelect() {

    if (this.state.openpage === "jbxx") {
      return (<PaymentTable paymentuserdata={this.state.paymentuserdata} 
        projectdata={this.state.projectdata} customerdata={this.state.customerdata}
        orgunitdata={this.state.orgunitdata} />);
    } else if (this.state.openpage === "fkmx") {
      return (<PaymentActivityList    paymentuserdata={this.state.paymentuserdata} />);
    } else if (this.state.openpage === "zlsc") {
      return (<PaymentAttache id={this.props.paymentStore.paymentModel.id}
        isedit={this.props.paymentStore.paymentModel.isedit} colcontrol={this.props.paymentStore.paymentModel.colcontrol} paytype={this.props.paytype}
        allow_col={this.props.paymentStore.paymentModel.allow_col} status={this.props.paymentStore.paymentModel.status}
      />);
    } else if (this.state.openpage === "spxx") {
      return (<Lookcheck bill="payment" billid={this.props.paymentStore.paymentModel.id} bill_type={this.props.paytype}
        orgunitid={this.props.paymentStore.paymentModel.orgunitid}
      />);
    }
  };
  render() {
    if (this.state.loading) return null;
    return (
      <div>
        <div style={{ marginBottom: 16 }}>
          <Button type="primary" style={{ margin: "10px" }} onClick={() => this.handlebackpage()}>
            <i className="fa fa-reply m-r-5" />
            返回
          </Button>
          <Divider type="vertical" />
          <Button type="primary" onClick={() => this.handleadd()}>
            <i className="fa fa-plus m-r-5" />
            新增
          </Button>
          <Divider type="vertical" />
          <Button type="primary" onClick={() => this.handleSave()} disabled={!this.props.paymentStore.paymentModel.isedit}>
            <i className="fa fa-save m-r-5" />
            保存
          </Button>
          <Divider type="vertical" />
          <Button type="primary" onClick={() => this.handleDelete()} disabled={this.props.paymentStore.paymentModel.status !== 0}>
            <i className="fa fa-trash m-r-5" />
            删除
          </Button>
          <Divider type="vertical" />
          <Button type="primary" onClick={() => this.handleCheck()} >
            <i className="fa fa-check m-r-5" />
            {this.props.paymentStore.paymentModel.status === 0 ? "提交" : "审核"}
          </Button>
        </div>
        <div>
          <Menu onClick={this.tabsClick} selectedKeys={this.state.openpage} mode="horizontal">
            <Menu.Item key="jbxx">基本信息</Menu.Item>
            <Menu.Item key="fkmx">款项明细</Menu.Item>
            <Menu.Item key="zlsc">资料上传</Menu.Item>
            <Menu.Item key="spxx">审批信息</Menu.Item>
          </Menu>
          {this.templateSelect()}
        </div>
      </div>
    );
  };
}
export default inject('paymentStore')(observer(PaymentToolbar));